/**
 * 多列容器
 * @author  韦胜健
 * @date    2021/12/23 14:57
 */
[data-component=image] {
  img {
    display: block;
  }

  [data-component=fixed-size-container] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    & > .cms-visual-editor-fixed-size-container > .cms-visual-editor-base-container-empty {
      background-color: rgba(255, 255, 255, 0.45);
    }
  }
}

/**
 * 多列容器
 * @author  韦胜健
 * @date    2021/12/23 14:57
 */
[data-component=column-container] {
  & > .cms-visual-editor-base-container {
    flex: 1;
    overflow: hidden;
  }
}

/**
 * 多行容器
 * @author  韦胜健
 * @date    2021/12/23 15:06
 */
[data-component=rows-container] {

}

/**
 * 固定容器
 * @author  韦胜健
 * @date    2022/2/10 10:37
 */
[data-component=fixed-size-container] {
  & > div.cms-visual-editor-fixed-size-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    & > .cms-visual-editor-base-container {
      height: 100%;
      width: 100%;

      &[data-component=rows-container] {
        display: flex !important;
        flex-direction: column;

        & > .cms-visual-editor-base-container {
          flex: 1;
          overflow: hidden;
        }
      }
    }
  }
}

/**
 * 正方形容器
 * @author  韦胜健
 * @date    2022/2/10 10:37
 */
[data-component=square-container] {
  .cms-visual-editor-square-container-wrapper {
    padding-bottom: 100%;
    position: relative;
    box-sizing: border-box;

    .cms-visual-editor-square-container {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow: hidden;

      & > .cms-visual-editor-base-container {
        height: 100%;
        width: 100%;
      }
    }
  }
}

/**
 * 商品列表组件
 * @author  韦胜健
 * @date    2022/2/28 18:28
 */
[data-component=product-list] {
  & > div, & > a {
    &:not(.cms-visual-editor-base-container-operator) {
      display: inline-block !important;
      vertical-align: top;
    }
  }

  .cms-visual-editor-base-container-empty {
    text-align: center;
  }
}

/**
 * 轮播容器
 * @author  韦胜健
 * @date    2022/2/10 10:37
 */
.visual-editor-carousel-container {
  .pl-carousel-operator-btn {
    background-color: whitesmoke !important;
    border-radius: 0 !important;
    color: black !important;
  }
}

/**
 * 热区容器
 * @author  韦胜健
 * @date    2022/3/6 13:17
 */
[data-component=range-container] {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/**
 * 热区容器
 * @author  韦胜健
 * @date    2022/3/6 13:17
 */
[data-component=range-item] {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: none !important;

  .cms-visual-editor-base-container-empty-content {
    display: none;
  }
}
